import React from 'react';
import {Link} from 'react-router-dom';
import Case from './Case';
import {fetch} from '@utils/Fetch';

class Content extends React.PureComponent {
  state = {
    cases: []
  };

  componentDidMount() {
    this.fLoad();
  }

  fLoad = () => {
    fetch('/api/case').get()
      .success(res => this.setState({cases: res.content}));
  };

  render() {
    const {cases = []} = this.state;
    return (
      <div className='full-content'>
        <div className='home-header'>
          <div className='new-case'>
            <Link to='/home/add' replace
                  style={{width: 45, height: 45, lineHeight: '45px', textAlign: 'center'}}
            >
              新案例
            </Link>
          </div>
        </div>
        <div className='home-list'>
          {cases.map(c => (<Case key={c._id} history={this.props.history} item={c} />))}
        </div>
      </div>
    )
  }
}

export default Content;
